.tree-input-bk {
    max-height: 0;
    width: calc(100% + 100px);
    top: 38px;
    position: absolute;
    z-index: 999;
    right: 0;
    // left:calc(0px - 100px);
    overflow: hidden;
    transition: max-height .3s;
    -webkit-transition: max-height .3s;

    .tree-input-relation {
        --tw-bg-opacity: 1;
        background-color: hsl(var(--b1)/var(--tw-bg-opacity));   
        border: 1px solid;
        border-color: hsla(var(--bc) / .1);
        padding: 10px;
        // height: 300px;
        // max-width: 300px;
        width: 100%;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;


        .ztreeTopBox {
            margin: 0 0 5px 0;

            // input {
            //     border: 1px solid lighten(@ztree-border-color, 50%);
            // }

            &+.ztree {
                flex: auto;
                overflow: auto;
                overflow-y: scroll;
            }

            .toolsBox {
                line-height: 18px;
                padding: 5px 0 0 0;

                a {
                    color: #fff;
                    margin: 0 0 0 5px;
                    text-decoration: underline;
                }
            }
        }
    }
}

.ztree{
    li{
        a{
            color: hsla(var(--bc)/var(--tw-text-opacity,1)) !important;
        }
    }
}
.actTree+.tree-input-bk {
    display: block;
    max-height: 300px;
}

.ztree-form-box {
    height: 100%;
    box-sizing: border-box;

    .ztree-form-main {
    }
}

.fix-ztree{
    position: relative;
    &> .tree-input-bk{
        left:0;
        right: auto;
        width: 100%;
    }
}